@import '~@/px2vw.less';

html,
body {
    -webkit-overflow-scrolling: touch;
}

.blankPage {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.fakeItem {
    height: .px2vw(100) [ @vw];
}

.entryGuideCtr {
    overflow: auto;
    background-color: #f6f7f8;

    .name {
        color: #49536c;
        font-size: .px2vw(14) [ @vw];
        text-align: center;
        margin-bottom: .px2vw(5) [ @vw];
    }

    .title {
        color: #2a2f3c;
        font-size: .px2vw(16) [ @vw];
        text-align: center;
        font-weight: 600;
        margin-bottom: .px2vw(25) [ @vw];
    }

    .info {
        background-color: #fff;
        font-size: .px2vw(12) [ @vw];
        color: #858b9b;
        text-align: center;
        padding: .px2vw(24) [ @vw] .px2vw(16) [ @vw] .px2vw(16) [ @vw];

        .step2Intro {
            display: flex;
            align-items: center;
            justify-content: center;

            .line {
                display: block;
                width: .px2vw(16) [ @vw];
                background-color: #bcc1cd;
                height: 1px;
                margin: 0 .px2vw(4) [ @vw];
            }
        }
    }

    .steps {
        :global {
            .am-steps-item-process .am-steps-item-title {
                color: #49536c;
                font-size: .px2vw(14) [ @vw];
                font-weight: normal;
            }

            .am-steps-item-wait .am-steps-item-title {
                color: #858b9b;
                font-size: .px2vw(12) [ @vw];
                font-weight: normal;
            }

            .am-steps-item-finish .am-steps-item-title {
                color: #49536c;
                font-size: .px2vw(14) [ @vw];
                font-weight: normal;
            }
        }
    }

    .commonTitle {
        color: #2a2f3c;
        font-size: .px2vw(16) [ @vw];
        width: 92%;
        margin: 0 auto;
        padding-top: .px2vw(14) [ @vw];
        font-weight: bold;
    }

    .uploadInfo {
        color: #858b9b;
        font-size: .px2vw(14) [ @vw];
        text-align: center;
        width: 90%;
        margin: 0 auto;
        line-height: .px2vw(24) [ @vw];
    }

    .formatInfo {
        color: #bcc1cd;
        text-align: center;
        font-size: .px2vw(12) [ @vw];
    }

    .stepBtnCtr {
        background-color: #fff;

        .stepBtn {
            padding: .px2vw(8) [ @vw] .px2vw(16) [ @vw] .px2vw(8) [ @vw];
            align-items: center;
            box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.08);
        }
    }

    :global {
        .formContainer {
            background-color: #fff;
            padding: .px2vw(14) [ @vw] .px2vw(16) [ @vw];

            .formTitle {
                height: .px2vw(30) [ @vw];
                font-size: .px2vw(16) [ @vw];
                font-weight: 600;
                color: #2a2f3c;
                line-height: .px2vw(30) [ @vw];
            }

            .formItemValue {
                font-size: .px2vw(14) [ @vw];
                color: #bcc1cd;
                word-break: break-all;
            }

            .am-input-control input::-webkit-input-placeholder {
                font-size: .px2vw(16) [ @vw];
            }

            .uploadTips {
                text-align: center;
                font-size: .px2vw(14) [ @vw];
                color: #49536c;
                margin: 0 .px2vw(-8) [ @vw];

                p {
                    line-height: .px2vw(24) [ @vw];
                    margin-bottom: .px2vw(4) [ @vw];
                }

                .anticon {
                    color: #ffa22d;
                }
            }

            .noticeContent {
                margin: .px2vw(12) [ @vw] 0;
                list-style: decimal;
                padding-left: .px2vw(16) [ @vw];
                margin-bottom: .px2vw(16) [ @vw];
                font-size: .px2vw(14) [ @vw];
                font-weight: 400;
                color: #49536c;
                line-height: .px2vw(24) [ @vw];
            }

            .tranTip {
                font-size: .px2vw(14) [ @vw];
                font-weight: 400;
                color: #49536c;
                line-height: .px2vw(24) [ @vw];
            }
        }

        .formContainer2 {
            background-color: #fff;
            padding: .px2vw(14) [ @vw] .px2vw(16) [ @vw];
            word-break: break-all;

            .noticeContent2 {
                margin: .px2vw(12) [ @vw] 0;
                list-style: decimal;
                padding-left: .px2vw(16) [ @vw];
                margin-bottom: .px2vw(16) [ @vw];
                font-size: .px2vw(14) [ @vw];
                font-weight: 400;
                color: #49536c;
                line-height: .px2vw(24) [ @vw];
            }
        }

        .formControls {
            padding: .px2vw(8) [ @vw] .px2vw(16) [ @vw];
            border-top: 1px solid rgba(0, 0, 0, 0.05);
            display: flex;
            align-items: center;
            box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.08);
        }

        .customPicker {
            border-radius: .px2vw(12) [ @vw] .px2vw(12) [ @vw] 0 0;

            .am-picker-popup-header-left {
                color: #858b9b;
            }

            .am-picker-popup-title {
                color: #2a2f3c;
                font-weight: 500;
            }

            .am-picker-col-item {
                overflow: hidden;
            }
        }

        .customTextarea {
            textarea {
                color: #858b9b;
            }
        }
    }
}

.accordionList {
    :global {
        // am-accordion
        .am-accordion-item {
            margin-bottom: 8px;

            .am-accordion-header {
                font-size: .px2vw(16) [ @vw];
                font-weight: bold;
                color: #2a2f3c;
                line-height: .px2vw(58) [ @vw];
                height: .px2vw(58) [ @vw];

                &:after {
                    display: none !important;
                }
            }
            .am-accordion-header i {
                top: .px2vw(23) [ @vw];
            }
        }

        // am-list
        .am-list-item {
            min-height: .px2vw(55) [ @vw];

            .am-list-content {
                font-size: .px2vw(14) [ @vw];
                color: #49536c;
            }

            .am-list-extra {
                font-size: .px2vw(14) [ @vw];
            }
        }

        .editListItem {
            margin: 0 15px;
            padding: 16px 0;

            .icon {
                right: 4px;
            }
            & > div:first-child {
                padding: 0 0 4px 0;
            }
        }

        .list-item-plus {
            padding: 0 15px;
            font-size: .px2vw(14) [ @vw];
            color: #49536c;

            .hasIcon {
                padding-right: 15px;
            }

            .icon {
                position: absolute;
                right: 4px;
                width: 8px;
                height: 15px;
            }
        }
    }
}

.modalMaterialsTips {
    :global {
        .am-modal-title {
            line-height: .px2vw(28) [ @vw];
            font-size: .px2vw(18) [ @vw];
            font-weight: bold;
        }

        .am-modal-body {
            text-align: left;
            font-size: .px2vw(14) [ @vw];
            font-weight: 400;
            color: #2a2f3c;
            line-height: .px2vw(24) [ @vw];
        }
    }
}

.tipText {
    font-size: .px2vw(12) [ @vw];
    color: #bcc1cd;
}

.textList {
    list-style: decimal;
    padding-left: .px2vw(16) [ @vw];
    font-size: .px2vw(14) [ @vw];
    color: #bbc1ce;
    line-height: 1.8;
    margin-bottom: 0;
}

.textContent {
    padding-left: .px2vw(16) [ @vw];
    font-size: .px2vw(14) [ @vw];
    color: #bbc1ce;
    line-height: 1.8;
    margin-bottom: 0;
}

.entryTimeModal {
    width: 100%;
    tr {
        line-height: 24px;
        td {
            padding: 2px 0;
        }
        td:first-child {
            width: 100px;
            font-size: 14px;
            color: #858b9b;
            text-align: right;
        }
        td:last-child {
            color: #000;
            font-size: 14px;
            text-align: left;
            padding-left: 10px;
        }
    }
}
